import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:yysk_app/model/pay_model/bank_card_list_model.dart';
import 'package:yysk_app/pages/my_webview/my_webview_page.dart';
import 'package:yysk_app/pages/nft_pages/pay_pages/pay_order/pay_order_controller.dart';
import 'package:yysk_app/pages/nft_pages/wallet_pages/manage_bank/add_bank_card_page.dart';
import 'package:yysk_app/routes/global_controller.dart';
import 'package:yysk_app/utils/colors.dart';
import 'package:yysk_app/utils/helper.dart';
import 'package:yysk_app/utils/js_tool.dart';
import 'package:yysk_app/widget/button_widget.dart';
import 'package:yysk_app/widget/checkbox_widget.dart';
import 'package:yysk_app/widget/count_down_timer.dart';
import 'package:yysk_app/widget/custom_app_bar.dart';
import 'package:yysk_app/widget/custom_app_bar2.dart';
import 'package:yysk_app/widget/image_asset_widget.dart';
import 'package:yysk_app/widget/input_widget.dart';
import 'package:yysk_app/widget/verification_code_widet.dart';

class PayOrderPage extends GetView<PayOrderController> {
  static const path = '/PayOrderPage';
  PayOrderPage({super.key});
  final TextEditingController _accountController = TextEditingController();
  final TextEditingController _codeController = TextEditingController();
  @override
  Widget build(BuildContext context) {
    double top = MediaQuery.of(context).padding.top;
    return Scaffold(
      // key: _scaffoldKey,
      resizeToAvoidBottomInset: false,
      // appBar: CustomAppBar(title: '收银台', context: context, actions: []),
      body: Obx(
        () => Stack(
          children: [
            Text('${controller.drarwCount}',style: TextStyle(fontSize: 0),),
            SizedBox(
              width: context.width,
              child: ImageAssetWidget(
                width: 350.px,
                height: 155.px,
                imageUrl: 'static/images/tabbar/top_bg.png',
              ),
            ),
            Padding(
              padding: EdgeInsets.only(left: 0.px, top: top, right: 0.px),
              child: 
              Column(
                children: [
                  CustomAppBar2(title: '收银台', context: context),
                  Expanded(
                    child: ListView(
                      // mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        Padding(
                          padding: EdgeInsets.only(left: 14.px, right: 14.px),
                          child: controller.payInfo.value!=null?    Column(
                            children: [
                              Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Text(
                                    '￥',
                                    style: TextStyle(
                                      fontSize: 30.px,
                                      color: AppColors.fontColorGreen,
                                    ),
                                  ),
                                  Text(
                                    controller.payInfo.value!.tradeAmt??'0',
                                    style: TextStyle(
                                      fontSize: 60.px,
                                      color: AppColors.fontColorGreen,
                                      fontWeight: FontWeight.w600,
                                    ),
                                  ),
                                ],
                              ),
                              SizedBox(height: 6.px),
                              Row(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  Text(
                                    '支付剩余时间',
                                    style: TextStyle(
                                      fontSize: 14.px,
                                      color: AppColors.fontColorGrey,
                                      fontWeight: FontWeight.w400,
                                    ),
                                  ),
                                  SizedBox(width: 5.px),
                                  CountdownTimer(
                                    expireTime:
                                        (controller
                                                      .payInfo
                                                      .value!
                                                      .expireTime??0), // 替换为实际的过期时间戳
                                    fontColor: AppColors.fontColorGrey,
                                  ),
                                ],
                              ),
                              SizedBox(height: 48.px),
                              SizedBox(
                                width: context.width,
                                child: Column(
                                mainAxisAlignment: MainAxisAlignment.start,
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Text(
                                '选择银行卡',
                                style: TextStyle(
                                  fontSize: 16.px,
                                  color: AppColors.fontColorBlack,
                                  fontWeight: FontWeight.w400,
                                ),textAlign: TextAlign.left,
                              ),
                              SizedBox(height: 19.px),
                              ],
                              ),
                              ),
                              ...controller.payCards.map((e){
                                return _payItem(context: context,item:e);
                              }),
                              // _payItem(context: context),
                              _addBank(context: context),
                             _buildInput(
                                '手机号',
                                disable: false,
                                controller.phoneController,
                                hint: '请输入银行卡预留手机号',
                                context: context,
                                 maxLength:11
                              ),
                               SizedBox(height: 16.px),
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.center,
                                children: [
                                  Expanded(
                                    child: _buildInput(
                                      '短信验证',
                                      controller.smsController,
                                      hint: '输入短信验证码',
                                      context: context,
                                        maxLength:6
                                    ),
                                  ),
                                  const SizedBox(width: 8),
                                  Obx(
                                    () => ElevatedButton(
                                      onPressed:
                                          controller.smsBtnText.value == '获取验证码'
                                              ? controller.getbankCardId
                                              : null,
                                      style: ElevatedButton.styleFrom(
                                        backgroundColor: Colors.white,
                                        foregroundColor: Colors.white,
                                        elevation: 0,
                                        shape: RoundedRectangleBorder(
                                          borderRadius: BorderRadius.circular(
                                            16,
                                          ),
                                        ),
                                      ),
                                      child: Text(
                                        controller.smsBtnText.value,
                                        style:  TextStyle(
                                          color: AppColors.fontColorBlack,
                                          fontSize: 16.px,
                                          fontWeight: FontWeight.normal,
                                        ),
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                             
                            ],
                          ):Text('')
                      
                        ),
                      ],
                    ),
                  ),
                  Stack(
                    children: [
                       Positioned(bottom: -15.px,right: 0,child: ImageAssetWidget(imageUrl: 'static/images/bottom_bg.png',width: 258.px,height: 74.px,)),
                
                      Container(
                    height: 100.px,
                    width: 375.px,
                    margin: EdgeInsets.only(bottom: 20.px),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,

                      children: [
                             controller.payMethod.value == 'HUIFU'
                                  ? Row(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.center,
                                    children: [
                                      CheckboxWidget(
                                        checked: controller.isRead.value,
                                        size: 12.px,
                                        onChanged: (value) {
                                          controller.isRead.value = value;
                                        },
                                      ),
                                      Text(
                                        '我已阅读理解并同意',
                                        style: TextStyle(
                                          color: AppColors.fontColorBlack,
                                          fontSize: 12.px,
                                        ),
                                      ),
                                      GestureDetector(
                                        onTap: () {
                                            final GlobalController globalController = Get.find();
                                          final staticInfo = globalController.staticInfo.value;
                                          Get.toNamed(
                                            '${MyWebViewPage.path}?url=${Uri.encodeComponent(staticInfo?.hnPayAgreement ?? '')}',
                                            arguments: {
                                              'url': Uri.encodeComponent(
                                                staticInfo?.hnPayAgreement ?? '',
                                              ),
                                            },
                                          );
                                        },
                                        child: Text(
                                          '《汇付支付服务协议》',
                                          style: TextStyle(
                                            color: AppColors.fontColorGreen,
                                            fontSize: 12.px,
                                          ),
                                        ),
                                      ),
                                    ],
                                  )
                                  : SizedBox(height: 141.px),
                        SizedBox(height: 14.px),
                        Center(
                          child: ButtonWidget(
                            label: "${controller.txt}",
                            width: 322,
                            height: 54,
                            fontSize: 18.px,
                            imageBg: 'static/images/btm.png',
                            contentType: ContentType.other,
                            onPressed: () {
                              controller.pay();
                            },
                          ),
                        ),
                      ],
                    ),
                  ),
                    ],
                  )
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

    Widget _buildInput(
    String label,
    TextEditingController controller, {
    required BuildContext context,
    required int maxLength,
     bool disable = true,
    String? hint,
  }) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          label,
          style: TextStyle(
            color: AppColors.fontColorBlack,
            fontSize: 16.px,
            fontWeight: FontWeight.bold,
          ),
        ),
        TextField(
          controller: controller,
          maxLength: maxLength,
          enabled: disable,
          decoration: InputDecoration(hintText: hint, border: InputBorder.none, counterText: '',),
        ),
        Container(
          width: context.width,
          height: 1.px,
          color: AppColors.backgroundColorGreyF7,
        ),
      ],
    );
  }

  _payItem({required BuildContext context,required BankCardListModel item}) {
    return Container(
      width: context.width,
      padding: EdgeInsets.fromLTRB(21.px, 23.px, 10.px, 23.px),
      margin: EdgeInsets.only(bottom: 10.px),
      decoration: BoxDecoration(
        color: AppColors.backgroundColorGreyF2,
        borderRadius: BorderRadius.circular(8.px),
      ),

      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Expanded(
            child: Text(
              '${item.bankName} （${item.bankCardNo} ）',
              style: TextStyle(
                fontSize: 16.px,
                color: AppColors.fontColorBlack,
                overflow: TextOverflow.ellipsis,
              ),
            ),
          ),

          CheckboxWidget(checked: item.isSelect!, size: 14,onChanged: (value) {controller.changeSelect(item.id!);},),
        ],
      ),
    );
  }

  _addBank({required BuildContext context}) {
    return GestureDetector(
      onTap: () {
         Get.toNamed(
      '${AddBankCardPage.path}?bindType=PAY&comeFrom=order',
      arguments: {
        'bindType': 'PAY',
        'comeFrom':'order'
      },
    );
      },
      child: Container(
        width: context.width,
        height: 45.px,
        margin: EdgeInsets.only(bottom: 10.px),
        decoration: BoxDecoration(
          color: AppColors.backgroundColor,
          borderRadius: BorderRadius.circular(143.px),
          border: Border.all(
            width: 1.px,
            color: AppColors.backgroundColorGreyBold,
          ),
        ),

        child: Center(
          child: Text(
            '+添加银行卡',
            style: TextStyle(
              fontSize: 16.px,
              color: AppColors.fontColorBlack,
              overflow: TextOverflow.ellipsis,
            ),
          ),
        ),
      ),
    );
  }
}
